@(grps: List[(Group, Resource)])

@import play.api.i18n._
@import helper._
@import helper.twitterBootstrap._

@main {

  @if(grps.size > 0) {
    <div class="row-fluid">
      <div class="panel-group" id="resGrpAccordion">
        @grps.groupBy(_._1).toSeq.sortBy(_._1.name).map {
          case (group, resources) => {
            <div class="panel panel-default">
              <div class="panel-heading">
                <h4 class="panel-title">
                  <a class="accordion-toggle" data-toggle="collapse" data-target="#grp-collapse-@group.id" href="#grp-collapse-@group.id">@group.name</a>
                  <span class="pull-right" style="padding-right:10px;"><a href="@group.homePage"><span class="glyphicon glyphicon-home"></span></a></span>
                </h4>
              </div>
              <div id="grp-collapse-@group.id" class="panel-collapse collapse in">
                <div class="panel-body">
                  <table class="table" id="tbl-@group.id">
                    <thead>
                      <tr>
                        <th width="60%"><b>@Messages("res.name.col")</b></th>
                        <th width="30%"><b>@Messages("res.version.col")</b></th>
                        <th width="10%"></th>
                      </tr>
                    </thead>
                    <tbody>
                    @resources.map { resource =>
                      <tr>
                        <td>
                          <a href="@resource._2.uri" target="_blank">@resource._2.name</a>
                        </td>
                        <td>@resource._2.version</td>
                        <td>
                          <a class="pull-right" href="@routes.Resources.edit(resource._2.id.get)">
                            <span class="glyphicon glyphicon-edit"></span>
                          </a>
                        </td>
                      </tr>
                    }
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
          }
        }  
      </div>  
    </div>
  } 

}